
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        .text{
            width: 400px;
            height: 30px;
            overflow: none;
            font-size: 15px;
        }
        button{
            width: 60px;
            height: 36px;
            background-color: #999999;
            color: whitesmoke;
            border: 0;
            border-radius: 0px 5px 5px 0px;
        }
    </style>
</head>
<body>
    <input type="text" placeholder="毛衣" class="text">
    <button class="but">搜全栈</button>
</body>
<script>
    var text1 = document.querySelector('.text')
    var but =  document.querySelector('.but')
    var str = ''
    text1.onfocus = function(){
        str = text1.placeholder
        text1.placeholder=""

    }
    text1.onblur = function(){
        text1.placeholder= str
    }
    but.onclick=function(){
        var xin = text1.value
        if(xin.length >=6 && xin.length <=16){
            alert('正确')
        }else{
            alert('不正确')
        }
    }
</script>
</html>